home *** CD-ROM | disk | FTP | other *** search
/ Freaks Macintosh Archive / Freaks Macintosh Archive.bin / Freaks Macintosh Archives / Textfiles / Programmer's Digest 1.0.sit / The Programmers Digest™ 1.0.rsrc / TEXT_136.txt < prev    next >
Text File  |  1998-11-11  |  6KB  |  105 lines
  1.  
  2.  
  3.  
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10. Written by: Alex Blaine
  11. Edited by: ZiffDuck
  12.         
  13.     So you wanna learn HTML, do ya?  I will teach you everything you need to
  14. know to get a page up on the internet along with the basic text
  15. manipulation tags in HTML.  Later, I will teach you the more advanced
  16. features of HTML.  Just as a note, HTML stands for HyperText Markup
  17. Language.  First, what are tags?  If you have ever looked at the source of
  18. an HTML document, you would have seen a lot of things like <BR>.  This is
  19. what we call a tag.  Tags ALWAYS start with a "<" and end with a ">".
  20. These tell the browser that what is in between these two signs (< and >) is
  21. a tag and not just plain text.  In other words, it says "Hey, don't really
  22. display this, but use it to format the final outcome of my page."  Well, it
  23. doesn't really say this, but that is the essence of it.  Some tags have
  24. both a starting and an ending tag while others just have a starting tag.
  25. Ending tags always start with "</" and end with ">" with the same text in
  26. between the two that the starting tag has (ex.  </B> would be the closing
  27. tag for <B> and </TABLE> would be the ending tag for <TABLE>, ex.2--If you
  28. typed <B>HTML is awesome</B>, HTML is awesome would become bold.)  When I
  29. introduce tags that have ending tags, I will call them
  30. "<TAG_NAME></TAG_NAME>" so you will know if they have an ending tag or not.
  31. Tags can also have attributes.  If it does, the attributes will go in the
  32. beginning tag (ex.  <IMG SRC= "http://website/graphic.gif"> - <IMG> would
  33. be the actual tag, and SRC would be an attribute of it.)  Some tags might
  34. have many attributes, and some might not have any.  If the tag has an
  35. attribute and you don't add it, it will leave it at the default.  Just as
  36. a(nother) note, I use all caps in my tags just as good form and ease of
  37. distinguishing it from normal text.  Tags can be in all lower case, as in
  38. "<table>" or in random case, as in "<TaBLe>."  There are a lot of tags, but
  39. we will only mention a few in this issue.  Now, to start our first HTML
  40. page...  Most HTML pages have the framework as follows:
  41. <HTML>
  42. <HEAD>
  43. <TITLE>Title</TITLE>
  44. </HEAD>
  45. <BODY>
  46. </BODY>
  47. </HTML>
  48.  
  49. Now, here's an in-depth look at what's going on here:  The <HTML></HTML>
  50. tells the browser where the start and stop of the HTML document is.  To use
  51. HTML tags, these must be here.  The <HEAD></HEAD> tags hold the tags that
  52. go in the  the head section of the document (hence the name of the tag.)
  53. In this, we see the <TITLE>Title</TITLE> tags (the title of this page will
  54. be "Title") (note:  no quotation marks are required between tags), but
  55. there are other tags that go in the head section of the page.  Inside the
  56. <BODY></BODY> tags is where all the action goes on--where you will do all
  57. of your page formatting.  Now that you have the framework down, let's start
  58. with the real stuff.  Something I need to tell you is that White Space
  59. (returns, spaces [more than one], tabs, etc...) does not matter.  I could
  60. have written the framework as:
  61. <HTML><HEAD><TITLE>Title</TITLE></HEAD><BODY></BODY></HTML>
  62. I would have gotten the same effect as the other one, but it wouldn't be
  63. very easy to read.  (There is an exception to this--the <PRE></PRE> tags,
  64. which we will talk about later)  Now, lets go head-first into the good
  65. stuff.  There are many formatting tags which will be explained to you here.
  66. To simulate a carriage return (in C or C++ it is \n), you would insert the
  67. <BR> tag.  That stands for "Line Break."  The <P> tag signals a new
  68. paragraph.  It inserts a line break along with some vertical space.  If you
  69. need two (or more) spaces in a row, you would type  .  This is more of
  70. an escape sequence than a tag, but since we were on the topic of
  71. formatting, I thought I would throw it in.  If you have an unreasonable
  72. number of spaces (like 15), you might want to use the <PRE></PRE> tags.
  73. You would put 15 spaces in between the two tags.  It would save time,
  74. space, and your fingers for that matter.  Text manipulating will be the
  75. next subject that I cover here.  There are many tags to change the way text
  76. looks.  To make it bold, you would use the <B></B> tags.  Italics would be
  77. indicated by the <I></I> tags.  Underlined text would be the <U></U> tags.
  78. The <S></S> tags would make strike-through text.  If you wanted your page
  79. to show an actual HTML tag (like you wanted "<FRAMESET>" to appear in the
  80. middle of the page), you would use the <CODE></CODE> tags.  Be sure to
  81. close this, because if you don't, it will be the last tag that the browser
  82. recognizes on that page.  <TT></TT> would make the text appear in a
  83. "Typewriter" font.  The <EM></EM> tags are used to give text Emphasis.  To
  84. make the text a size larger, you would use the <BIG></BIG> tags, where as
  85. if you wanted to make it smaller, you would use the <SMALL></SMALL> tags.
  86. To make some text have the maximum emphasis, you would use the
  87. <STRONG></STRONG> tags.  <SUB></SUB> tags make the enclosed text
  88. subscripted.  The <SUP></SUP> tags make it superscripted.  To indicate a
  89. distinctive citation, you would use the <CITE></CITE> tags.  If you had a
  90. defined term, they might be marked by the <DFN></DFN> tags.  Sample in-line
  91. text would be inside the <SAMP></SAMP> tags.  The last tag that will be
  92. shown today is the <XMP></XMP> tags.  They render text in a fixed width
  93. font.  You can experiment with these different tags on your own and create
  94. different outcomes.  Before your next lesson, I would suggest using these
  95. for fun to gain a better understanding of them.  You can just create a
  96. plain text document called "something.html" and open it in your browser to
  97. see how it turned out.  If you make a change to your document source, just
  98. save the changes and click reload in your browser window.  Well, until next
  99. time, have fun with what I have taught you today.
  100. For a general overview of HTML, go to:
  101. http://www.geocities.com/athens/2040
  102. and use what you have learned there.  I will eventually cover all of the
  103. topics you see there, but when it fits in.
  104.  
  105.